{% extends 'base.html' %}

{% block title %}{{repair['title']}}{% endblock %}

{% block content %}
	<article class="weui-article">
      <h1>{{repair['title']}}</h1>
       <ul class="weui-media-box__info">
       	<li class="weui-media-box__info__meta">{{repair['publisher'].nickname}}</li>
       	<li class="weui-media-box__info__meta">{{repair['pub_time'].strftime('%Y-%m-%d %H:%M:%S')}}</li>
       </ul>
        <section>
          <p>
          	{% autoescape false %}
				{{repair['content']}}
          	{% endautoescape %}
          </p>
        </section>
    </article>

    <div class="weui-cell">
    	<div class="weui-cell__bd">
	    <p class="weui-media-box__desc">
		经办人：<span id="operator">{{repair['operator'].nickname}}</span> |
		优先级：{{{0:'低',1:'中',2:'高'}[repair['urgency']]}}  | 
		状态：{{{'00':'待确认','01':'已确认', '02':'处理中','03':'处理完成','04':'已解决'}[repair['status']]}}
		</p>
		</div>
	</div>
  {% if ((g.user.roles and g.user.roles.index(',1002,') > 0) or g.user.id == repair['publisher_id']) and '04' != repair['status'] and staff %}
	<div class="weui-cell">
	<div class="weui-cell__hd"><label for="name" class="weui-label">变更经办人：</label></div>
    <div class="weui-cell__bd">
      <input class="weui-input" id="oper" type="text" value="{{repair['operator'].nickname}}">
    </div>
  </div>
  {% endif %}

  {% if g.user.id == repair['operator_id'] and '04' != repair['status'] %}
	<div class="weui-cell">
		  <div class="weui-btn-area">
        {% if '00' == repair['status'] %}
	       <a href="javascript:handleRepair('confirm',{{repair['id']}});" class="weui-btn weui-btn_mini weui-btn_primary">确认问题</a>
        {% elif '01' == repair['status'] %}
         <a href="javascript:handleRepair('handle',{{repair['id']}});" class="weui-btn weui-btn_mini weui-btn_primary">处理问题</a>
        {% elif '02' == repair['status'] %}
         <a href="javascript:handleRepair('complete',{{repair['id']}});" class="weui-btn weui-btn_mini weui-btn_primary">处理完成</a>
        {% elif '03' == repair['status'] %}
        <a href="javascript:handleRepair('close',{{repair['id']}});" class="weui-btn weui-btn_mini weui-btn_primary">问题已解决</a>
        <a href="javascript:handleRepair('reopen',{{repair['id']}});" class="weui-btn weui-btn_mini weui-btn_primary">问题未解决</a>
        {% endif %}
	    </div>
	</div>
  {% endif %}
  {% if repair.logs %}
  <div class="weui-panel weui-panel_access">
    <div class="weui-panel__hd">修改记录</div>
    <div class="weui-panel__bd">
      {% for log in repair.logs |sort(reverse=True,attribute='pub_time')%}
      <div class="weui-media-box weui-media-box_text">
        <h4 class="weui-media-box__title">{{log.content}}</h4>
        <p class="weui-media-box__desc"> 操作人:{{log.changer.nickname}} |
          时间：{{log['pub_time'].strftime('%Y-%m-%d %H:%M:%S')}}
          </p>
      </div>
      {% endfor %}
    </div>

  </div>
  {% endif %}
    <div class="weui-panel weui-panel_access">
        <div class="weui-panel__hd">回复</div>
        <div id="reply_panel" class="weui-panel__bd">
 		{% for reply in repair.replies %}
           <div class="weui-cell">
	        <div class="weui-cell__hd" style="position: relative;margin-right: 10px;">
	        {% if reply['publisher'].avatar %}
	          <img src="{{reply['publisher'].avatar}}" style="width: 50px;display: block">
	        {% else %}
	          <img src="/static/images/avatar.jpg" style="width: 50px;display: block">
	        {% endif %}
	        </div>
	        <div class="weui-cell__bd">
	          <p style="font-size: 13px;color: #888888;">{{reply['publisher'].nickname}}  <span style="float:right">{{reply['pub_time'].strftime('%Y-%m-%d %H:%M:%S')}}</span></p>
	          <p>{{reply['content']}}</p>
	        </div>
      		</div>
      	{% endfor %}
        </div>

{% if g.user %}
		    <div class="weui-cells weui-cells_form">
		      <div class="weui-cell">
		        <div class="weui-cell__bd">
		          <textarea class="weui-textarea" placeholder="请输入回复" rows="3"></textarea>

		        </div>
		      </div>

		      <div class="weui-cell">
			      <div class="button_sp_area">
			        <a href="javascript:postReply();" class="weui-btn weui-btn_mini weui-btn_default">回复</a>
			     </div>
		     </div>

		    </div>
{% endif %}		     

    </div>
{% endblock %}
{% block jsblock %}
$("#oper").select({
        title: "经办人",
        multi: false,
        autoClose: false,
        min: 1,
        max: 1,
        items: [
        {% for st in staff %}
        {
          title: "{{st.nickname}}",
          value: {{st.id}},
          description: "{{st.loginname}}"
        },
        {% endfor %}
        ],
        beforeClose: function(values, titles) {
          /*if(values.indexOf("0") !== -1) {
            $.toast("不能选睡觉", "cancel");
            return false;
          }*/
          return true;
        },
        onChange: function(data) {
        //console.log(data)
        console.log("onchange "+data['values']);
        },
        onClose: function (obj) {
          //console.log(obj.data.values)
          if(obj.data['origins'][0].checked) {
            console.log("unchange")
          }else {
            postData = {operator_id:obj.data.values,rprId:{{repair['id']}}};

            $.ajax({
                  type: 'POST',
                  url: '/changeOperator',
                  data: JSON.stringify(postData),
                  dataType : "json",
                  contentType: "application/json;charset=UTF-8",
                  success: function(data) {
                            if(data.success) {
                             //$("#operator").text(data.operator.nickname);
                            }else{
                               $.toast("更换失败请重试", "forbidden");
                            }
                            $(location).attr('href', '/showRepair/{{repair['id']}}');
                           },
                  error: function(msg) {
                        $.toast("更换失败请重试", "forbidden");
                        $(location).attr('href', '/showRepair/{{repair['id']}}');
                    }
                });

          }
        }
      });



function postReply() {
	if(!$(".weui-textarea").val()) {
		 $.toast("请输入回复内容", "forbidden");
		 return;
	}
	postData = {content:$(".weui-textarea").val(),rprId:{{repair['id']}}};
	$.ajax({
	  type: 'POST',
	  url: '/postRepairReply',
	  data: JSON.stringify(postData),
	  dataType : "json",
	  contentType: "application/json;charset=UTF-8",
	  success: function(data) {
	  			divHtml="";
	  			 $.each(data['replies'], function (n, reply) {
	  			 	var avatarPath = '/static/images/avatar.jpg';
	  			 	if(reply.publisher.avatar) {
	  			 		avatarPath = reply.publisher.avatar;
	  			    }
	  			  	divHtml = divHtml+'<div class="weui-cell"><div class="weui-cell__hd" style="position: relative;margin-right: 10px;">'
	  				                 +'<img src="'+ avatarPath + '" style="width: 50px;display: block"></div><div class="weui-cell__bd">'
	  				                 +'<p style="font-size: 13px;color: #888888;">'+ reply.publisher.nickname +'<span style="float:right">' + reply.pub_time
	  				                 +'</span></p><p>' + reply['content'] +'</p></div></div>';
	  			 });
	  			$("#reply_panel").html(divHtml);
	  			$.toast("回复成功", function() {
		          $(".weui-textarea").val("")
		        });
	           },
	  error: function(msg) {
	  			$.toast("回复失败请重试", "forbidden");
			}
	});

}

function handleRepair(op,rprId) {
postData = {op:op,rprId:rprId};
$.ajax({
      type: 'POST',
      url: '/handleRepair',
      data: JSON.stringify(postData),
      dataType : "json",
      contentType: "application/json;charset=UTF-8",
      success: function(data) {
                if(data.success) {
                  $(location).attr('href', '/showRepair/{{repair['id']}}');
                }else{
                   $.toast("处理失败请重试", "forbidden");
                }
               },
      error: function(msg) {
            $.toast("处理失败请重试", "forbidden");
        }
    });
}
{% endblock %}